@import "var";
@import "config";


@mixin utils-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@mixin utils-clearfix {
  $selector: &;

  @at-root {
    #{$selector}::before,
    #{$selector}::after {
      display: table;
      content: "";
    }

    #{$selector}::after {
      clear: both
    }
  }
}

@mixin utils-flex-just {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

@mixin utils-flex-warp {
  display: flex;
  flex-wrap: wrap;
}

@mixin utils-box-shadow {
  box-shadow: 0 2px 11px 0 rgba(190, 202, 218, .17);
  border: 2px #FFF solid;
  border-radius: 3px;
  transition: $--all-transition;
  &:hover {
    box-shadow: 0 2px 11px 0 rgba(190, 202, 218, .9);
  }
}


@mixin block($block) {
  $B: $namespace+'-'+$block !global;

  .#{$B} {
    @content;
  }
}


@mixin child($name) {
  &#{$bi-separator + $name} {
    @content;
  }
}
